<template>
  <div class="app-container">
    <el-menu
      v-if="!$route.meta?.fullScreen"
      class="advanced-menu"
      mode="horizontal"
      :default-active="$route.path"
      router
    >
      <!-- 添加Logo和文字 -->
      <div class="logo-container">
        <img src="/logo.jpg" alt="Logo" class="logo">
        <span class="logo-text">offer多多</span>
      </div>
      
      <el-menu-item index="/" class="nav-item">
        <span class="nav-text">首页</span>
        <div class="nav-highlight"></div>
      </el-menu-item>
      <el-menu-item index="/school" class="nav-item">
        <span class="nav-text">校招</span>
        <div class="nav-highlight"></div>
      </el-menu-item>
      <el-menu-item index="/intern" class="nav-item">
        <span class="nav-text">实习</span>
        <div class="nav-highlight"></div>
      </el-menu-item>
      <el-menu-item index="/resume" class="nav-item">
        <span class="nav-text">简历</span>
        <div class="nav-highlight"></div>
      </el-menu-item>
      <el-menu-item index="/write" class="nav-item">
        <span class="nav-text">笔试</span>
        <div class="nav-highlight"></div>
      </el-menu-item>
      <el-menu-item index="/interview" class="nav-item">
        <span class="nav-text">面试</span>
        <div class="nav-highlight"></div>
      </el-menu-item>
      <el-menu-item index="/help" class="nav-item">
        <span class="nav-text">帮助文档</span>
        <div class="nav-highlight"></div>
      </el-menu-item>

      <el-menu-item index="/user" class="nav-item">
        <span class="nav-text">个人中心</span>
        <div class="nav-highlight"></div>
      </el-menu-item>
      <el-menu-item index="/system" class="nav-item" v-if="isAdmin">
        <span class="nav-text">系统管理</span>
        <div class="nav-highlight"></div>
      </el-menu-item>
    </el-menu>
    
    <div class="content-wrapper">
      <router-view>
      </router-view>
    </div>
  </div>
</template>

<script setup>
import { onMounted, ref } from 'vue'
const isAdmin = ref(false);

onMounted(() => {
  isAdmin.value = localStorage.getItem('userId')==='1';
})

defineOptions({
  name: 'App'
})
</script>

<style lang="scss" scoped>
.logo-container {
  display: flex;
  align-items: center;
  margin-right: 30px;
  margin-left: 20px;
  
  .logo {
    height: 40px;
    width: auto;
    margin-right: 10px;
  }
  
  .logo-text {
    color: #464646;
    font-size: 18px;
    font-weight: bold;
    letter-spacing: 1px;
  }
}
</style>